<template>
  <div class="app-container no-padding chit-look-root">
    <div class="query-container">
      <chit-query placeholder="请输入受灾等级" :only-query="true" @query="attQuery"
                  :base-map="baseMap"></chit-query>
    </div>
    <base-map @geoQueryBak="geoQueryBak" :buffer-map-config="bufferMapConfig" @mapLoaded="mapLoaded"></base-map>
  </div>
</template>

<script>
import BaseMap from "@/components/BaseMap/index.vue";
import {baseMapMixins} from "@/mixins/baseMapMixins";
import mapConfig from "@/data/szMapConfig.json";
import {pageBaseMapMixins} from "@/mixins/pageBaseMapMixins";
import {
  getFeaturesByQueryResult,
  union,
  getGeometryListByQueryResult,
  queryResultsByUrls
} from 'lark-map'
import ChitQuery from "@/views/chitLook/components/chitQuery/index.vue";

export default {
  name: "chitLook",
  mixins: [baseMapMixins, pageBaseMapMixins],
  components: {
    ChitQuery,
    BaseMap
  },
  data() {
    return {
      layerId: 'baodan',
      bufferMapConfig: mapConfig,
    }
  },
  methods: {
    async attQuery(param) {
      this.removeMapHighlight()
      let {baseMap: {view}, layerId} = this
      let whereValue = `SZDJ LIKE '%${param}%'`
      let result = {
        view: view,
        idList: [layerId],
        outFields: [{parentId: layerId, value: ['*']}],
        where: [{parentId: layerId, value: whereValue}],
        returnGeometry: [{parentId: layerId, value: true}],
        subLayerIds: [{parentId: layerId, value: [0]}]
      }
      let res = await queryResultsByUrls(result)

      let geometryList = getGeometryListByQueryResult({res, merge: true})

      if (!geometryList?.length) {
        this.$message.warning('没有查询结果')
        return
      }
      let unionGeometry = union(geometryList)
      this.baseMap.highlight(unionGeometry)
    },
    geoQueryBak(res, mapPoint) {
      let features = getFeaturesByQueryResult({res, mapPoint})
      this.openPopup(this.layerId, features, mapPoint, '保单信息')
    }
  },
  created() {
    this.awaitMapLoaded().then(() => {
      let txtFileList = [
        {
          value: '保单号',
          label: '保单号',
          addToMap: false,
        },
        {
          value: 'TBR',
          label: '嘎查/村',
          addToMap: false,
        },
        {
          value: 'ZZSX',
          label: '种植作物',
          addToMap: false,
        },
        {
          value: 'SZDJ',
          label: '受灾等级',
          addToMap: false,
        },
      ]
      this.addLayerFiledInfo(this.layerId, txtFileList)
    })
  }
}
</script>

<style lang="scss" scoped>
.chit-look-root {
  position: relative;

  .query-container {
    position: absolute;
    top: 20px;
    left: 20px;
    width: 500px;
    height: 40px;
    z-index: 20;
  }
}
</style>
